
@media screen and (min-width: 600px) {
  #app{
    header {
      .title-c {
        .title {
          display: none;
        }
        .title-pc {
          display: block;
          font-size: 24PX;
        }
      }
      .nav-dot{
        display: block;
        right: 40PX;
        font-size: 14PX;
        &-item{
          line-height: 24PX;
          width: 24PX;
          height: 24PX;
          margin: 12PX auto;
          em{
            left: 20PX;
            width: 12PX;
            height: 12PX;
          }
          .-title{
            width: 60PX;
            left: -70PX;
            border-radius: 3PX 0 0 3PX;
            &::after {
              content: '';
              position: absolute;
              right: -12PX;
              width: 0;
              height: 0;
              border-top: 12PX solid transparent;
              border-left: 12PX solid rgba(0, 0, 0, 0.7);
              border-bottom: 12PX solid transparent;
            }
          }
        }
      }
    }
    main{
      .overview{
        .content{
          .des{
            .quote {
              font-size: 22PX;
            }
            .des-list {
              padding-top: 30PX;
              font-size: 18PX;
            }
          }
        }
      }
      .skill{
        .content{
          top:30vh;
          .des{
            margin-top:0;
            margin-left:100PX;
            line-height: 24PX;
            font-size: 16PX;
            max-width: 750PX;
          }
        }
      }
      .experience{
        .content{
          top:20vh;
          .slider{
            width: 750PX;
            height: 350PX;
            &-container{
              display: flex;
              align-items: center;
              h4{
                font-size: 20PX;
              }
              .-post{
                font-size:15PX;
              }
              .right{
                margin-left: 100PX;
                .-time{
                  font-size:20PX;
                }
                .-list{
                  width:400PX;
                  .exp-item{
                    font-size:16PX;
                    line-height: 30PX;
                  }
                }
              }

            }

          }
          .shout-cut{
            padding-top: 10vh;
            width: 200PX;
          }
        }
      }
      .work{
        .content{
          .work-list{
            &-item{
              max-height: 450PX;
            }
          }
          .switch{
            width: 500PX;
          }
        }
      }
      .contact{
        .content{
          .words{
            font-size: 22PX;
            width:300PX;
          }
          .words-en{
            width:500PX;
          }
          .idea{
            font-size: 18PX;
          }
          .download{
            margin-top: 100PX;
            max-width:200PX;
          }
          .way{
            max-width:350PX;
            &-item{
              width:40PX;
              height:40PX;
            }
          }
        }
      }
    }
    footer{
      .github{
        iframe{
          width:92PX;
        }
      }
    }
  }
}
